<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
	session.setAttribute("basePath", basePath);
%>
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<base href="${basePath }">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<meta name="description" content="">
<meta name="author" content="">
<title>西普茗茶商品-付款</title>
<meta name="renderer" content="webkit">

<!-- BEGIN GLOBAL MANDATORY STYLES -->
<link href="https://cdn.bootcss.com/font-awesome/4.0.3/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
<link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<link href="assets/plugins/uniform/css/uniform.default.css" rel="stylesheet" type="text/css" />
<link href="assets/css/animate.css" rel="stylesheet" type="text/css" />
<!-- END GLOBAL MANDATORY STYLES -->
<!-- BEGIN PAGE LEVEL STYLES -->
<link href="https://cdn.bootcss.com/Swiper/3.0.8/css/swiper.min.css" rel="stylesheet" type="text/css" />
<!-- END PAGE LEVEL STYLES -->
<!-- BEGIN THEME STYLES -->
<link href="assets/css/style-metronic.css" rel="stylesheet" type="text/css" />
<link href="assets/css/style.css" rel="stylesheet" type="text/css" />
<link href="assets/css/style-responsive.css" rel="stylesheet" type="text/css" />
<link href="assets/css/plugins.css" rel="stylesheet" type="text/css" />
<link href="assets/css/themes/light.css" rel="stylesheet" type="text/css" id="style_color" />
<link href="assets/css/print.css" rel="stylesheet" type="text/css" media="print" />
<link href="assets/css/custom.css" rel="stylesheet" type="text/css" />
<link href="assets/css/pages/blog.css" rel="stylesheet" type="text/css" />
<link href="css/iconfont.css" rel="stylesheet" type="text/css" />
<!-- END THEME STYLES -->
<link rel="shortcut icon" href="favicon.ico" />

<script type="text/javascript">
	var isHTML5 = true;
</script>
<!--[if lt IE 9]>
    <script src="https://cdn.bootcss.com/html5shiv/r29/html5.min.js"></script>
    <script src="https://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
	<script src="js/excanvas.min.js"></script> 
    <script type="text/javascript">
		isHTML5 = false;
	</script>
<![endif]-->

<style type="text/css">
.swiper-slide {
	text-align: center;
	font-size: 18px;
	background: #fff;
	/* Center slide text vertically */
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	align-items: center;
}
</style>
</head>
<!--/head-->
<!-- BEGIN BODY -->
<body class="page-footer-fixed">
	<!-- BEGIN HEADER -->
	<div class="header navbar">
		<div class="container-fluid">
			<div class="row">
				<div class="col-xs-2 text-center">
					<a href="./" class="icon_a_link">
						<i style="font-size: 24px; line-height: 40px; height: 40px;" class="iconfont icon-qh-home text-gold">&#xe61a;</i>
					</a>
				</div>
				<div class="col-xs-8 text-center">
					<h4>付款</h4>
				</div>
				<div class="col-xs-2 text-center">
					<a href="item/infocenter.jsp" class="icon_a_link">
						<i style="font-size: 24px; line-height: 40px; height: 40px;" class="iconfont text-gold icon-qh-infocenter">&#xe61d;</i>
					</a>
				</div>
			</div>
		</div>
	</div>
	<!-- END HEADER -->
	<div class="clearfix "></div>
	<!-- BEGIN CONTAINER -->
	<div class="page-container">

		<!-- BEGIN CONTENT -->
		<div class="page-content-wrapper">
			<div class="page-content no-space" style="margin-bottom: 50px !important;">

				<c:if test="${orderList==null||fn:length(orderList)<=0 }">
					<h4 class="text-center G-MarginTop50">
						<span class="glyphicon glyphicon-hand-right"></span> 您没有订单需要支付
					</h4>
				</c:if>
				<c:if test="${orderList!=null&&fn:length(orderList)>0 }">
					<!-- 清除浮动 -->
					<div class="clearfix"></div>
					<c:if test="${fn:length(orderList)>1 }">
						<div class="alert alert-info margin-top-20" role="alert">
							您有多个订单需要支付，支付总金额为<span class="text-red"><strong> <fmt:formatNumber value="${allTotalPrice}" type="currency" pattern="#,##0.##" /></strong> </span>元
						</div>
					</c:if>
					<c:forEach items="${orderList }" var="ord" varStatus="orSta">
						<div class="well well-sm margin-top-20 margin-bottom-20">
							<div class="blog-page no-space">
								<c:if test="${fn:length(orderList)>1 }">
									<h4 class="text-center">
										<strong>------订单 ${orSta.count }(${ord.operationMode })------</strong>
									</h4>
								</c:if>
								<p>订单名称：${ord.orderName }</p>
								<p>订单号：${ord.orderId }</p>
								<p>
									<span>交易金额： <fmt:formatNumber value="${ord.orderTotalPrice }" type="currency" pattern="#,##0.##" /> 元
									</span>
									<c:if test="${ord.orderFreight>0 }">
										<span>（已包含邮费 <fmt:formatNumber value="${ord.orderFreight }" type="currency" pattern="#,##0.##" /> 元）
										</span>
									</c:if>
									<c:if test="${ord.orderFreight<=0 }">
										<span>（卖家包邮）</span>
									</c:if>
								</p>
								<p>
									提交时间：
									<fmt:formatDate value="${ord.orderBuyTime }" pattern="yyyy年MM月dd日 HH:mm:ss" />
								</p>
								<p>收货地址： ${ord.orderBuyerAddress }， ${ord.orderBuyerName }（收） ${ord.orderBuyerPhone }</p>
								<h4 class="text-center margin-top-10">
									<span class="text-black">交易金额：</span><span class="text-red"><strong><i class="fa fa-rmb"></i> <fmt:formatNumber value="${ord.orderTotalPrice }" type="currency" pattern="#,##0.##" /></strong></span>
								</h4>
								<br>
								<div>
									<c:if test="${ord.operationMode=='西普茗茶' }">
										<button class="btn btn-lg green btn-block ziying_wechat_pay" data-pay-style="微信支付" data-order-id="${ord.orderId }"
											data-total-price="<fmt:formatNumber value="${ord.orderTotalPrice }" type="currency" pattern="#,##0.##" />">微信支付</button>
									</c:if>
									<c:if test="${ord.operationMode=='西普茗茶' }">
										<button class="btn btn-lg green btn-block mzc_wechat_pay" data-pay-style="美赞臣支付" data-order-id="${ord.orderId }"
											data-total-price="<fmt:formatNumber value="${ord.orderTotalPrice }" type="currency" pattern="#,##0.##" />">微信支付</button>
									</c:if>
								</div>
								<br>
								<p class="text-center">
									<c:if test="${ord.orderActualTax!=null&&ord.orderActualTax>0 }">
										<span>根据相关进口规定，跨境商品订单金额超过一定限额时海关需征收行邮税 </span>
									</c:if>
								</p>
							</div>
						</div>
					</c:forEach>
					<div class="clearfix"></div>
				</c:if>
			</div>
			<!-- END CONTAINER -->
		</div>
	</div>

	<input type="hidden" id="appId" value="">
	<input type="hidden" id="timestamp" value="">
	<input type="hidden" id="nonceStr" value="">
	<input type="hidden" id="signature" value="">
	<input type="hidden" id="ticket" value="">
	<input type="hidden" id="currentUrl" value="">

	<!-- BEGIN JAVASCRIPTS(Load javascripts at bottom, this will reduce page load time) -->
	<!-- BEGIN CORE PLUGINS -->
	<script src="https://cdn.bootcss.com/jquery/1.10.2/jquery.min.js" type="text/javascript"></script>
	<script src="https://cdn.bootcss.com/jquery-migrate/1.2.1/jquery-migrate.min.js" type="text/javascript"></script>
	<!-- IMPORTANT! Load jquery-ui-1.10.3.custom.min.js before bootstrap.min.js to fix bootstrap tooltip conflict with jquery ui tooltip -->
	<script src="assets/plugins/jquery-ui/jquery-ui-1.10.3.custom.min.js" type="text/javascript"></script>
	<script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js" type="text/javascript"></script>
	<script src="assets/plugins/bootstrap-hover-dropdown/bootstrap-hover-dropdown.min.js" type="text/javascript"></script>
	<script src="assets/plugins/jquery-slimscroll/jquery.slimscroll.min.js" type="text/javascript"></script>
	<script src="assets/plugins/jquery.blockui.min.js" type="text/javascript"></script>
	<script src="assets/plugins/jquery.cokie.min.js" type="text/javascript"></script>
	<script src="assets/plugins/uniform/jquery.uniform.min.js" type="text/javascript"></script>
	<script src="js/wow.min.js"></script>
	<script src="js/bootstrap.file-input.js"></script>
	<!-- END CORE PLUGINS -->
	<!-- BEGIN PAGE LEVEL PLUGINS -->
	<script type="text/javascript" src="https://cdn.bootcss.com/Swiper/3.0.8/js/swiper.jquery.min.js"></script>
	<script type="text/javascript" src="assets/plugins/jquery-validation/dist/jquery.validate.min.js"></script>
	<script type="text/javascript" src="assets/plugins/jquery-validation/localization/messages_zh.js"></script>
	<script type="text/javascript" src="assets/plugins/select2/select2.min.js"></script>
	<script type="text/javascript" src="assets/plugins/jquery-bootpag/jquery.bootpag.min.js"></script>
	<script type="text/javascript" src="js/jquery.form.js"></script>
	<!-- END PAGE LEVEL PLUGINS -->
	<!-- BEGIN PAGE LEVEL SCRIPTS -->
	<script src="js/app.js"></script>
	<script src="https://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
	<!-- END PAGE LEVEL SCRIPTS -->

	<script>
		$(function()
		{
			// Initiat WOW JS
			if (isHTML5 == true)
			{
				new WOW().init();
			}
			App.init();

			//确认付款操作
			$(".ziying_wechat_pay,.mzc_wechat_pay").click(function()
			{
				var obj = $(this);

				$.post('${basePath}getWechatOrderInfo.do',
				{
					"currentUrl" : location.href.split('#')[0],
					'order_id' : obj.attr("data-order-id")
				},
				//回调函数 
				function(json)
				{
					/* WeixinJSBridge.invoke('getBrandWCPayRequest', json.param, function(res)
					{
						alert(res.err_code + res.err_desc + res.err_msg);
						if (res.err_msg == "get_brand_wcpay_request：ok")
						{
						} // 使用以上方式判断前端返回,微信团队郑重提示：res.err_msg将在用户支付成功后返回    ok，但并不保证它绝对可靠。 
					}); */
					var json_param = eval("(" + json.param + ")");
					wx.chooseWXPay(
					{
						timestamp : json_param.timeStamp, // 支付签名时间戳，注意微信jssdk中的所有使用timestamp字段均为小写。但最新版的支付后台生成签名使用的timeStamp字段名需大写其中的S字符
						nonceStr : json_param.nonceStr, // 支付签名随机串，不长于 32 位
						package : json_param.package, // 统一支付接口返回的prepay_id参数值，提交格式如：prepay_id=***）
						signType : json_param.signType, // 签名方式，默认为'SHA1'，使用新版支付需传入'MD5'
						paySign : json_param.paySign, // 支付签名
						success : function(res)
						{
							// 支付成功后的回调函数
							if (res.errMsg == "chooseWXPay:ok")
							{
								alert("支付成功，将为您跳转到订单详情页面。系统需要一点时间处理订单，如果订单仍显示为待付款，您可以等待几分钟再刷新页面查看订单状态，如果10分钟后仍显示为待付款，可联系客服解决。");
								window.location.href = "show_order_detail?id=" + obj.attr("data-order-id");
							} // 使用以上方式判断前端返回,微信团队郑重提示：res.err_msg将在用户支付成功后返回    ok，但并不保证它绝对可靠。 
						}
					});
				},
				//返回类型
				"json");

			});

			$.post("wc_get_wechat_info",
			{
				"currentUrl" : location.href.split('#')[0]
			}, function(json)
			{
				$("#test_div").html(json.appId + "," + json.timestamp + "," + json.nonceStr + "," + json.signature + "," + json.ticket + "," + json.currentUrl);
				wx.config(
				{
					debug : false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
					appId : json.appId, // 必填，公众号的唯一标识
					timestamp : json.timestamp, // 必填，生成签名的时间戳
					nonceStr : json.nonceStr, // 必填，生成签名的随机串
					signature : json.signature,// 必填，签名，见附录1
					jsApiList : [ 'onMenuShareTimeline', 'chooseWXPay' ]
				// 必填，需要使用的JS接口列表，所有JS接口列表见附录2
				});

				wx.ready(function()
				{
					wx.onMenuShareTimeline(
					{
						title : '', // 分享标题
						link : '', // 分享链接
						imgUrl : '', // 分享图标
						success : function()
						{
							// 用户确认分享后执行的回调函数
							alert("成功分享了");
						},
						cancel : function()
						{
							// 用户取消分享后执行的回调函数
							alert("取消分享了");
						}
					});
				});
				wx.error(function(res)
				{
				});

				//判断是否获得用户信息
				var code = "${param.code}";
				if (code.length > 0)
				{
					$.post("wc_get_user_info",
					{
						'code' : code
					}, function(return_json)
					{
						if (return_json.success == true)
						{
							//alert("openid(getUserInfo):" + return_json.openid);
						}
					},
					//返回类型
					"json");
				}
				else
				{
					$.post("wc_valid_have_this_person", {}, function(valid_json)
					{
						if (valid_json.success == false)
						{

							String
							authUrl = "https://open.weixin.qq.com/connect/oauth2/authorize?appid=APPID&redirect_uri=REDIRECT_URI&response_type=code&scope=SCOPE&state=STATE#wechat_redirect";

							authUrl = authUrl.replace("APPID", json.appId);
							authUrl = authUrl.replace("REDIRECT_URI", location.href.split('#')[0]);
							authUrl = authUrl.replace("SCOPE", "snsapi_base");
							authUrl = authUrl.replace("STATE", 1);
							window.location.href = authUrl;
						}
						else
						{
							//alert("openid(validHaveThisPerson):" + valid_json.openid);
						}
					},
					//返回类型
					"json");
				}

			},
			//返回类型
			"json");

		});
	</script>
	<!-- END JAVASCRIPTS -->
</body>
</html>